/* Psychedelic effect styling for the easter-egg */
.psychedelic {
  animation: ss-psy-hue 3s linear infinite;
  filter: saturate(180%) contrast(120%);
}

@keyframes ss-psy-hue {
  0% { filter: hue-rotate(0deg) saturate(160%) contrast(120%); }
  25% { filter: hue-rotate(90deg) saturate(240%) contrast(140%); }
  50% { filter: hue-rotate(180deg) saturate(200%) contrast(120%); }
  75% { filter: hue-rotate(270deg) saturate(260%) contrast(140%); }
  100% { filter: hue-rotate(360deg) saturate(160%) contrast(120%); }
}

/* add glowing outlines to headings and important text */
.psychedelic h1, .psychedelic h2, .psychedelic h3, .psychedelic p, .psychedelic a {
  text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 18px rgba(200,120,220,0.7);
}

/* make the emoji buttons slightly visible and positioned */
.ss-egg-emoji { background: transparent; border: none; font-size: 18px; margin-right: 8px; cursor: pointer; opacity: 0.9; }
.ss-egg-emoji:hover { transform: scale(1.08); }

/* hide existing decorative pseudo-element on LIs we target so there is no duplicate mushroom */
li.ss-egg-target::before {
  display: none !important;
  content: "" !important;
}

/* reduce effect intensity on small screens */
@media (max-width: 480px){
  .psychedelic { animation-duration: 4s; }
}